// import React, {PureComponent} from 'react';
// import {TouchableOpacity,
//     Text, View, TextInput, StyleSheet, Image, Alert,SectionList} from 'react-native';
//
//
// export default class App extends PureComponent {
//     dataContainer = [];
//
//     constructor(props) {
//         super(props);
//         this.state = {
//             /**假设1为选择，2为取消*/
//             sourceData: [
//                 { key: "招牌菜-3", data: [{ title: "鱼香茄子",type:1 }, { title: "酸菜鱼",type:2 }, { title: "红烧肉",type:1 }] },
//                 { key: "凉菜-12", data: [{ title: "花生米" ,type:2}, { title: "黄瓜",type:1 }] },
//                 { key: "主食-8", data: [{ title: "米饭" ,type:1},] },
//             ]
//             , selected: (new Map(): Map<String, boolean>)
//             , refreshing: false
//             , indexText: ''
//         }
//     }
//
//     componentDidMount() {
//
//     }
//
//     /**
//      * 此函数用于为给定的item生成一个不重复的Key。
//      * Key的作用是使React能够区分同类元素的不同个体，以便在刷新时能够确定其变化的位置，减少重新渲染的开销。
//      * 若不指定此函数，则默认抽取item.key作为key值。若item.key也不存在，则使用数组下标
//      *
//      * @param item
//      * @param index
//      * @private
//      */
//     _keyExtractor = (item, index) => index;
//
//     /**
//      * 使用箭头函数防止不必要的re-render；
//      * 如果使用bind方式来绑定onPressItem，每次都会生成一个新的函数，导致props在===比较时返回false，
//      * 从而触发自身的一次不必要的重新render，也就是FlatListItem组件每次都会重新渲染。
//      *
//      * @param id
//      * @private
//      */
//     _onPressItem = (id: string) => {
//         this.setState((state) => {
//             const selected = new Map(state.selected);
//             selected.set(id, !selected.get(id));
//             return {selected}
//         });
//
//         //CustomToastAndroid.show(JSON.stringify(id), CustomToastAndroid.SHORT);
//     };
//
//
//
//
//     // 下拉刷新
//     _renderRefresh = () => {
//         this.setState({refreshing: true})//开始刷新
//         //这里模拟请求网络，拿到数据，3s后停止刷新
//         setTimeout(() => {
//             //CustomToastAndroid.show('没有可刷新的内容！', CustomToastAndroid.SHORT);
//             this.setState({refreshing: false});
//         }, 1000);
//     };
//
//     // 上拉加载更多
//     _onEndReached = () => {
//
//     };
//     /**点击选择或者取消*/
//     clickItem(item){
//         if(item.type===1){
//             alert('选择');
//         }else
//         {
//             alert('取消');
//         }
//     }
//
//
//     /**单元格*/
//     _renderItem = ({item}) => {
//         return (
//             <FlatListItem
//                 id={item.id}
//                 type={item.type}
//                 onClick={()=>this.clickItem(item)}
//                 onPressItem={this._onPressItem}
//                 selected={!!this.state.selected.get(item.id)}
//                 title={item.title}
//             />
//         );
//     };
//
//
//
//
//     /**区头*/
//     _sectionComp = (info) => {
//         var txt = info.section.key;
//         return (<View style={{height: 50, backgroundColor: 'white'}}>
//             <View style={{height:10,backgroundColor:'#eee'}}>
//             </View>
//             <View style={{height: 40, backgroundColor: 'white',justifyContent:'center'}}>
//                 <Text
//                     style={{color: 'red', fontSize:30,marginLeft:10}}>
//                     {txt}
//                 </Text>
//             </View>
//
//             {/*<Image source={src.line} style={{width: null, height: 1}} resizeMode='stretch'/>*/}
//         </View>);
//     }
//
//
//     render() {
//         return (
//             <View style={{flex:1}}>
//
//                 <SectionList
//                     ref={ref => this.SectionList = ref}
//                     renderSectionHeader={this._sectionComp}
//                     renderItem={this._renderItem}
//                     sections={this.state.sourceData}
//                     extraData={this.state.selected}
//                     keyExtractor={this._keyExtractor}
//                     onEndReachedThreshold={0.1}
//                     // 当列表被滚动到距离内容最底部不足onEndReacchedThreshold设置的距离时调用
//                     onEndReached={this._onEndReached}
//                     refreshing={this.state.refreshing}
//                     onRefresh={this._renderRefresh}
//                 />
//
//             </View>
//
//         );
//     }
// }
//
// class FlatListItem extends React.PureComponent {
//     _onPress = () => {
//         this.props.onPressItem(this.props.id);
//     };
//
//     render() {
//         return (
//             <TouchableOpacity
//                 {...this.props}
//                 onPress={this._onPress}
//             >
//                 <View style={{
//                     backgroundColor: '#eee',
//                 }}>
//                     <View style={styles.item_container}>
//                         <View style={{flexDirection: 'row', alignItems: 'center',}}>
//                             <Image style={{marginLeft:10,height:64,width:64,backgroundColor:'red',borderRadius:5}}/>
//                             <View style={{margin: 15}}>
//                                 <Text style={{color: 'yellow', fontSize: 28}}>{this.props.title}</Text>
//                                 <View style={{flexDirection: 'row', marginTop: 10}}>
//                                     <Text style={{color:'black', fontSize: 28}}>现价：</Text>
//                                     <Text style={{color:'black', fontSize: 24}}>¥28</Text>
//                                 </View>
//                                 <View style={{flexDirection: 'row', marginTop: 10,}}>
//                                     <Text style={{color:'black', fontSize: 24,textDecorationLine:'line-through'}}>原价：¥28</Text>
//                                 </View>
//
//                             </View>
//                         </View>
//
//                         {/*<View style={{alignSelf:'flex-end',marginBottom:10,marginRight: 10}}>*/}
//                         {/*<TouchableOpacity onPress={this.props.onClick}>*/}
//                         {/*<Image source={this.props.type===1? src.ic_goods_select:src.ic_goods_cancel} />*/}
//                         {/*</TouchableOpacity>*/}
//                         {/*</View>*/}
//
//
//                     </View>
//                     {/*<Image source={src.line} style={{width: null, height: 1}} resizeMode='stretch'/>*/}
//                 </View>
//             </TouchableOpacity>
//         );
//     }
// }
// var styles = StyleSheet.create({
//     base_view: {flex: 1, backgroundColor: '#eee'},
//     text_item: {
//         padding: 10, flex: 1, backgroundColor: '#fff', borderWidth: 1,
//         borderColor: '#0f80ff', marginLeft: 10
//     },
//     item_container: {
//         backgroundColor: 'white',
//         flexDirection: 'row',
//         alignItems: 'center',
//         justifyContent: 'space-between'
//     }
// });
